export default {
    data() {
        return {
            // preUrl:'skus',
            preUrl: '',

            multipleSelection: [],
            page: {
                current: 1,
                sizes: [10, 20, 30, 100],
                size: 10,
                total: 0,
            },
            loading:true, // 用于控制加载动画
        }
    },
    filters: {
        numToString(value) {
            return String(value);
        }
    },

    // 会在页面的created钩子函数之前执行
    created() {
        // 将sku/list下的created钩子函数提取到这里，避免每次重复调用
        this.getList();
        // console.log('Mixin created');
    },
    computed: {
        // 选中记录id组成的数组
        ids() {
            // multipleSelection本身就是一个数组，使用map方法将其中的内容再重新组织一下，里面包含item.id
            return this.multipleSelection.map(item => {
                return item.id;
            });
        },
    },
    methods: {
        // 写这两个方法的原因，在商品类型中添加类型--》关联规格弹出的规格卡片页面不能调用layout的showLoading和hideLoading方法
        // 因为在商品类型的页面中，layout是一个局部组件，而不是全局组件
        showLoading() {
            if(this.loading) {
                this.layout.showLoading();
            }
        },
        hideLoading(){
            if(this.loading) {
                this.layout.hideLoading();
            }
        },
        // 处理列表结果的方法
        // 可以在每个页面进行重写，页面调用的仍然是页面里的方法，而不是此处的同名的方法
        getListResult() {

        },
        // 获取列表请求分页的url
        getListUrl() {
            return `/admin/${this.preUrl}/${this.page.current}?limit=${this.page.size}`
        },
        getList() {
            // 如果没有设置preUrl，则不执行获取数据
            if (this.preUrl === '')
                return

            this.showLoading();
            let url = this.getListUrl();
            // let url = `/admin/skus/${this.page.current}?limit=${this.page.size}`;

            this.$axios.get(url, { 
                token: true,
                params: {
                    page: this.page.current,
                    limit: this.page.size
                }
            }).then((res) => {
                let data = res.data.data;
                // console.log(data);

                // 作为公共使用的，得到的值不一定是赋值给tableData，因此需要就页面而定
                // this.tableData = data.list,
                // 下面是新写的方法
                this.getListResult(data)

                // 分页的数据
                this.page.total = data.totalCount;

                this.hideLoading();
            }).catch(() => {
                // this.$message({
                //     type: 'error',
                //     // message: '获取数据失败，请稍后重试！'
                // });
                this.hideLoading();
            })
        },

        // 添加、编辑,当id=0时默认表示是添加操作
        addOrEdit(data, id = 0) {
            this.showLoading();
            let msg = id > 0 ? '修改' : '增加';
            let url = id > 0 ? `/admin/${this.preUrl}/${id}` : '/admin/'+this.preUrl;
            this.$axios.post(url, data,
                { token: true }).then(() => {
                    // console.log(res);
                    this.$message({
                        message: msg + '成功',
                        type: 'success',
                    });
                    this.getList(); // 重新获取列表数据
                    this.hideLoading();
                }).catch(() => {
                    this.hideLoading();
                })
        },
        // 批量删除的url
        deleteALLurl() {
            return `/admin/${this.preUrl}/delete_all`;
        },
        // 批量删除
        deleteALL() {
            // return console.log('批量删除', this.ids);

            if (this.ids.length === 0) {
                return this.$message({
                    type: 'warning',
                    message: '请至少选择一项进行删除!'
                });
            }

            this.$confirm('是否要删除这些项目?', '提示', {
                confirmButtonText: '删除',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                // this.multipleSelection.forEach(item => {
                //     let index = this.tableData.findIndex(v => v.id == item.id)
                //     if (index !== -1) {
                //         this.tableData.splice(index, 1)
                //     }
                // })
                // this.multipleSelection = []
                // this.$message({
                //     type: 'success',
                //     message: '删除成功!'
                // });
                this.showLoading(); // 隐藏加载动画 

                let url = this.deleteALLurl();
                this.$axios.post(url, {
                    ids: this.ids
                }, { token: true }).then(() => {
                    this.multipleSelection = []; // 清空选中项
                    this.$message({
                        type: 'success',
                        message: '删除成功!'
                    });
                    this.getList(); // 重新获取列表数据
                    this.hideLoading(); // 隐藏加载动画 
                }).catch(() => {
                    this.hideLoading(); // 隐藏加载动画 
                });
            })
        },

        // 修改状态，要写入混入了
        changeStatus(item) {
            // 请求服务端修改状态代码：
            let status = item.status === 1 ? 0 : 1; // 0为禁用，1为启用,判断最开始的状态，并取反
            let msg = status === 1 ? '启用' : '禁用'; //如果状态为1代表启用，否则代表禁用
            // console.log(item.id);

            this.showLoading(); // 显示加载动画
            this.$axios.post(`/admin/${this.preUrl}/${item.id}/update_status`, {
                status: status
            }, { token: true }).then(() => {
                item.status = status; // 更新前端状态
                this.$message({
                    message: msg + '成功',
                    type: 'success',
                });
                this.hideLoading(); // 隐藏加载动画
            }).catch(() => {
                this.hideLoading(); // 隐藏加载动画
            });
        },

        // 删除当前商品，写入混入了
        delItem(item) {
            this.$confirm('是否要删除该规格?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                // this.tableData.splice(scope, 1)
                // this.$message({
                //     type: 'success',
                //     message: '删除成功!'
                // });
                this.showLoading(); // 显示加载动画
                this.$axios.post('/admin/'+this.preUrl+'/' + item.id + '/delete', {}, {
                    token: true
                }).then(() => {
                    this.$message({
                        type: 'success',
                        message: '删除成功!'
                    })
                    this.getList(); // 重新获取列表数据
                    this.hideLoading(); // 隐藏加载动画
                }).catch(() => {
                    // console.log('删除失败:', err);

                    this.hideLoading(); // 隐藏加载动画
                })
            }).catch(()=>{
                
            })
        },

        // 选中，被引用到comon.js中
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        // 分页相关，将会写到common.js中
        handleSizeChange(val) {
            this.page.size = val; //记得要重新赋值
            this.getList();
        },
        handleCurrentChange(val) {
            this.page.current = val;
            this.getList();
        },
    }
}